<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib uri="http://displaytag.sf.net" prefix="display" %>
<jsp:include page="/WEB-INF/template/cabecalho.jsp"/>  

<%
//TODO: STYLE ACIMA
Integer i = 0, j = 0; 
String execJS = "", temp = "";
%>

<h1>Dist&acirc;ncia total do percurso: ${fleetEngineOutput.result.dist}</h1>
<h1>Tempo total do percurso: ${fleetEngineOutput.result.drivetime} <br/></h1>
</p>
<br/>
<c:forEach items="${fleetEngineOutput.resourceperiods}" var="rp" varStatus="s">
<c:set var="linkMapa" value=""/>
	<ul>
		<li>
			<hr>
			<fmt:parseDate var="dateObj" value="${fn:replace(rp.startdepot.starttime,'t', ' ')}" type="DATE" pattern="yyyy-MM-dd HH:mm:ss"/>
			<h4>In&iacute;cio Per&iacute;odo: <fmt:formatDate value="${dateObj}" pattern="dd/MM/yyyy HH:mm:ss"/></h4>
			<fmt:parseDate var="dateObj" value="${fn:replace(rp.stopdepot.starttime,'t', ' ')}" type="DATE" pattern="yyyy-MM-dd HH:mm:ss"/>
			<h4>Final Per&iacute;odo: <fmt:formatDate value="${dateObj}" pattern="dd/MM/yyyy HH:mm:ss"/></h4>
			<h4>Dist&acirc;ncia Total Percorrida: ${rp.totaldrivedist}</h4>
			<h4>Custo Total: ${rp.totalcost}</h4>
			<c:forEach items="${rp.jobs}" var="currentItem" varStatus="stat">
				<c:if test="${stat.count == 0}">
				<c:set var="linkMapa" value="?saddr="/>
				</c:if>
				<c:out value="${parametrosRoute.id}"/>
 				<c:set var="linkMapa" value="${linkMapa}${parametrosRoute.id}" />
			</c:forEach>
			<c:out value="${linkMapa}"/>
		</li> 		
		<li>
		
		<ul id="sortable_<%=++i%>">
			<c:forEach items="${rp.jobs}" var="job" varStatus="stat">
				<c:if test="${job.resource!=''}">
				<li class="ui-state-default">
				<span class="ui-icon ui-icon-arrowthick-2-n-s"></span>
					<strong>Ponto de Entrega:</strong> ${job.id} <br/>
					<strong>Recurso usado:</strong> ${job.resource} <br/>
					<fmt:parseDate var="dateObj" value="${fn:replace(job.starttime,'t', ' ')}" type="DATE" pattern="yyyy-MM-dd HH:mm:ss"/>
					<strong>In&iacute;cio:</strong> <fmt:formatDate value="${dateObj}" pattern="dd/MM/yyyy HH:mm:ss"/> <br/>	
				 	<strong>Entregue:</strong>
					<c:forEach items="${job.loads}" var="load" varStatus="s">
						${load.load} <br/>
					</c:forEach>				
				</li>
				</c:if>
			</c:forEach>
		</ul>
		</li>	
	</ul>	
<%
	execJS +="$('#sortable_" + i + "' ).sortable();	$( '#sortable_" + i + "' ).disableSelection();";
%>
</c:forEach>

<style>
<%
for(j=1;j<=i;j++){//TODO: MELHORAR O JEITO SEM USAR SCRIPTLET
%>
	#sortable_<%=j%> { list-style-type: none; margin: 0; padding: 0 0 0 15px; width: 60%; margin-bottom: 10px;}
	#sortable_<%=j%> li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.2em; }
	#sortable_<%=j%> li span { position: absolute; margin-left: -1.3em; }
<%
}
%>
</style>
<script>
	$(function() {
		$('#mnuResultados').addClass('ativo');
		<%= execJS %>
	});
</script>
<jsp:include page="/WEB-INF/template/rodape.jsp"/>